import { BasicColumn } from '@/components/Table';
import { FormSchema } from '@/components/Form';
import { useRender } from '@/hooks/component/useRender';
import { InputNumber, Input } from 'ant-design-vue';
import { VxeGridPropTypes, VxeTablePropTypes } from 'vxe-table';
import { getDictOptions } from '@/utils/dict';
import { DictEnum } from '@/enums/dictEnum';
const { renderDict } = useRender();
export const formSchems: FormSchema[] = [
  {
    label: '客户名称',
    field: 'customerName',
    component: 'Input',
  },
  {
    label: '创建日期',
    field: 'dateRange',
    component: 'RangePicker',
    colProps: { span: 10 },
    componentProps: {
      placeholder: ['开始日期', '结束日期'],
      format: 'YYYY-MM-DD',
      valueFormat: 'YYYY-MM-DD',
    },
  },
];

export const columns: BasicColumn[] = [
  {
    title: '订单编号#',
    dataIndex: 'orderNo',
    width: 160,
  },
  {
    title: '客户',
    dataIndex: 'customerConcatName',
  },
  {
    title: '类型',
    dataIndex: 'categoryId',
    customRender: ({ value }) => {
      return renderDict(value, DictEnum.ORDER_TYPE);
    },
  },
  {
    title: '订单状态',
    dataIndex: 'status',
    customRender: ({ value }) => {
      return renderDict(value, DictEnum.ORDER_STATUS);
    },
  },
  // {
  //   title: '回款进度',
  //   dataIndex: 'depositPercentage',
  //   customRender: ({ value }) => {
  //     return renderDict(value, DictEnum.CUSTOMER_SOUCE);
  //   },
  // },
  {
    title: '订金比例(%)',
    dataIndex: 'depositPercentage',
  },
  // {
  //   title: '利润率',
  //   dataIndex: 'customerOrderCount',
  // },
  {
    title: '币种',
    dataIndex: 'currencyId',
    customRender: ({ value }) => {
      return renderDict(value, DictEnum.CURRENCY);
    },
  },
  {
    title: '订单金额',
    dataIndex: 'depositAmount',
  },
  {
    title: '业务员',
    dataIndex: 'salesUserName',
  },
  {
    title: '下单日期',
    dataIndex: 'orderTime',
  },
  {
    title: '交货日期',
    dataIndex: 'deliveryTime',
  },
];

export const drawerSchemas: FormSchema[] = [
  {
    label: '订单编号',
    field: 'id',
    required: false,
    component: 'Input',
    show: false,
  },
  {
    label: '客户',
    field: 'customerId',
    required: false,
    slot: 'customerId',
  },
  {
    label: '联系人',
    field: 'customerConcatId',
    required: false,
    slot: 'customerConcatId',
  },
  {
    label: '客户订单',
    field: 'poOrderNo',
    required: false,
    component: 'Input',
  },
  {
    label: '类型',
    field: 'categoryId',
    required: true,
    component: 'Select',
    componentProps: {
      allowClear: false,
      options: getDictOptions(DictEnum.ORDER_TYPE),
    },
  },
  {
    label: '币种',
    field: 'currencyId',
    required: true,
    component: 'Select',
    componentProps: {
      allowClear: false,
      options: getDictOptions(DictEnum.CURRENCY),
    },
  },
  {
    label: '下单日期',
    field: 'orderTime',
    required: false,
    component: 'DatePicker',
    componentProps: {
      format: 'YYYY-MM-DD',
      valueFormat: 'YYYY-MM-DD HH:mm:ss',
    },
  },
  {
    label: '业务员',
    field: 'salesUserId',
    required: false,
    slot: 'salesUserId',
  },
];
export const drawerSchemas2: FormSchema[] = [
  {
    label: '运输方式',
    field: 'shippingId',
    required: true,
    component: 'Select',
    componentProps: {
      allowClear: false,
      options: getDictOptions(DictEnum.SYS_TRANSPORT),
    },
  },
  {
    label: '贸易术语',
    field: 'tradeTermId',
    required: true,
    component: 'Select',
    componentProps: {
      allowClear: false,
      options: getDictOptions(DictEnum.SYS_TRADE),
    },
  },
  {
    label: '交货期',
    field: 'deliveryTime',
    required: false,
    component: 'DatePicker',
    componentProps: {
      format: 'YYYY-MM-DD',
      valueFormat: 'YYYY-MM-DD HH:mm:ss',
    },
  },
];
export const drawerSchemas3: FormSchema[] = [
  {
    label: '',
    field: 'list',
    required: false,
    slot: 'list',
    itemProps: {
      autoLink: false,
    },
    colProps: { span: 24 },
  },
  {
    label: '产品金额',
    field: 'spuMoney',
    required: false,
    component: 'Input',
    colProps: { span: 8 },
    componentProps: {
      disabled: true,
    },
  },
  {
    label: '其他款项',
    field: 'otherMoney',
    required: false,
    component: 'Input',
    colProps: { span: 8 },
    componentProps: {
      disabled: true,
    },
  },
  {
    label: '总金额',
    field: 'totalAmount',
    required: false,
    component: 'Input',
    colProps: { span: 8 },
    componentProps: {
      disabled: true,
    },
  },
];

export const vxeTableColumns: VxeGridPropTypes.Columns = [
  {
    type: 'checkbox',
    align: 'center',
    width: 60,
  },
  {
    title: '序号',
    type: 'seq',
    fixed: 'left',
    width: '50',
    align: 'center',
  },
  {
    title: '商品名称',
    field: 'name',
    align: 'center',
    slots: {
      edit: ({ row }) => {
        if (row.type === 1) {
          return <Input v-model:value={row.name} placeholder="请输入"></Input>;
        } else {
          return row.name;
        }
      },
    },
    editRender: {},
  },
  {
    title: '商品ID',
    field: 'productId',
    align: 'center',
    visible: false,
  },
  {
    title: '类型',
    field: 'type',
    align: 'center',
    visible: false,
  },
  {
    title: '描述',
    field: 'remark',
    slots: {
      edit: ({ row }) => {
        return <Input v-model:value={row.remark} placeholder="请输入描述"></Input>;
      },
    },
    editRender: {},
  },
  {
    title: '数量',
    field: 'num',
    slots: {
      edit: ({ row }) => {
        return (
          <InputNumber
            v-model:value={row.num}
            min={1}
            max={99999}
            placeholder="请输入数量"
          ></InputNumber>
        );
      },
    },
    editRender: {},
  },
  {
    title: '单价',
    field: 'price',
    slots: {
      edit: ({ row }) => {
        return (
          <InputNumber
            v-model:value={row.price}
            min={1}
            max={99999}
            placeholder="请输入单价"
          ></InputNumber>
        );
      },
    },
    editRender: {},
  },
  {
    title: '合计',
    field: 'amount',
    slots: {
      default: ({ row }) => {
        return row.num * row.price;
      },
    },
  },
];

export const validRules: VxeTablePropTypes.EditRules = {
  num: [{ required: true, message: '请输入数量' }],
  price: [{ required: true, message: '请输入价格' }],
};
export const drawerSchemas4: FormSchema[] = [
  {
    label: '定金比例',
    field: 'depositPercentage',
    slot: 'depositPercentage',
    itemProps: {
      autoLink: false,
    },
    colProps: { span: 24 },
  },
  {
    label: '订金',
    field: 'depositAmount',
    required: false,
    component: 'InputNumber',
  },
  {
    label: '尾款',
    field: 'finalPayAmount',
    required: false,
    component: 'InputNumber',
  },
];
export const drawerSchemas5: FormSchema[] = [
  {
    label: '注意事项（Notes）',
    field: 'notes',
    required: false,
    component: 'InputTextArea',
    componentProps: {
      rows: 3,
    },
  },
  {
    label: '条款（Terms & Conditions）',
    field: 'conditions',
    required: false,
    component: 'InputTextArea',
    componentProps: {
      rows: 3,
    },
  },
];
